/**
 * Created by hcadmin on 16/4/18.
 */
define([
    "jquery",
    "IO",
    "UPLOADUI",
    "UPLOAD",
    "jqueryUI",
    "bootbox"
], function ($, IO, upui, up, jui, bootbox, definebt) {
    $(function(){

        //题目存储空间
        var div_question=[];

        //判断现在是添加的第几题题目,全局变量
        var div_question_count=0;

        //添加单选题
        $("#single").click(function(){

            div_question_count=$(".ct .div_question").length+1;

            var html='';
            html+='<div class="div_question div_question_over div_question_onclick" tabindex="-1" style="visibility: visible; cursor: default;">'+
               ' <div class="row">'+
                '<div class="col-md-3" style="text-align: right;">'+
                '<span>'+
                '(单选题)'+div_question_count+'.'+
                '</span>'+
            '</div>'+
            '<div class="col-md-4">'+
                '<input type="text" class="title" style="width: 100%;" placeholder="问题标题"/>'+
                '</div>'+
                '</div>'+
                '<div class="rows" style="padding-top: 10px;">'+
                '<div class="row" style="padding-top: 10px;">'+
                '<div class="col-md-2 col-md-offset-1" style="text-align: right;line-height: 26px;">'+
                '<span>选项1</span>'+
                '</div>'+
                '<div class="col-md-4">'+
                '<input style="width: 100%;" class="opstion"  type="text" />'+
                '</div>'+
                '<div class="col-md-3" style="line-height: 26px;">'+
                '</div>'+
                '</div>'+
                '<div class="row" style="padding-top: 10px;">'+
                '<div class="col-md-2 col-md-offset-1" style="text-align: right;line-height: 26px;">'+
                '<span>选项2</span>'+
                '</div>'+
                '<div class="col-md-4">'+
                '<input style="width: 100%;" class="opstion" type="text" />'+
                '</div>'+
                '<div class="col-md-3" style="line-height: 26px;">'+
                '<a class="addone" href="#" style="color: #6ab7ad;">'+
                '添加'+
                '</a>'+
                '</div>'+
                '</div>'+
                '</div>'+
                '<div class="row moseover" style="padding-top: 10px;">'+
                '<div class="col-md-7" style="text-align: right;">'+
                '<button type="button" class="btn maincolor delete" q_type="0">删除</button>'+
                '</div>'+
                '</div>'+
                '</div>';
            $(".ct").append(html);
        });

        //点击完成
        //$(document).on('click','.success',function(){
        //
        //    var q= {};
        //    var opstion='';
        //
        //    //拿到类型
        //    var q_type= $(this).attr('q_type');
        //    q.type=q_type;
        //
        //   $(this).parents('.div_question').find('input').each(function(){
        //       //console.log($(this).val());
        //       if($(this).hasClass('title')){
        //           q.title=$(this).val();
        //       }
        //       if($(this).hasClass('opstion')){
        //           opstion+=$(this).val()+'^';
        //       }
        //   });
        //    opstion=opstion.substring(0,opstion.length-1);
        //    q.opstion=opstion;
        //
        //    div_question.push(q);
        //    console.log(div_question);
        //});



        $(document).on('click','.delete',function(){

        });



        //动态新增栏目
        $(document).on('click','.addone',function(){
            //alert($(this).css('color'));
            var count= $(this).parent().parent().parent().children("div.row").length+1;

            $(this).parent().parent().parent().append(
                '<div class="row" style="padding-top: 10px;">'+
                '<div class="col-md-2 col-md-offset-1" style="text-align: right;line-height: 26px;">'+
                '<span>选项'+count+'</span>'+
                '</div>'+
                '<div class="col-md-4">'+
                '<input style="width: 100%;" class="opstion" type="text" />'+
                '</div>'+
                '<div class="col-md-3" style="line-height: 26px;">'+
                '<a class="addone" href="#" style="color: #6ab7ad;">添加选项</a>&nbsp;&nbsp;'+
                '<a class="removeone" href="#" style="color: red;">删除选项</a>'+
                '</div>'+
                '</div>'
            );
        });

        //动态删除选项
        $(document).on('click','.removeone',function(){
            $(this).parent().parent().remove();
        });

        //鼠标进入问题区域显示
        $(document).on('mouseenter','.div_question_over',function(event){
            // console.log($(this).children().last());
            // $(this).addClass('div_question_onclick');
            $(this).css('border','2px solid #57B47E');
            if($(this).children().last().hasClass("moseover")){

            }
            else {
                if($(this).children().last().hasClass("moseout")){
                    $(this).children().last().removeClass("moseout");
                }
                $(this).children().last().addClass("moseover");
            }
        });

        //鼠标出去到问题区域隐藏
        $(document).on('mouseleave','.div_question_over',function(event){
            //$(this).removeClass('div_question_onclick');
            $(this).css('border','2px solid whitesmoke');
            if($(this).children().last().hasClass("moseout")){

            }
            else {
                if($(this).children().last().hasClass("moseover")){
                    $(this).children().last().removeClass("moseover");
                }
                $(this).children().last().addClass("moseout");
            }
        });
    })
});
